Ext.define('Atman.controller.Dashboard6', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            dashboard:{
                selector:'#dashboardview6',
                xtype:'dashboardview6',
                autoCreate:true
            },
            dashboardMain:{
                selector:'#dashboardmain6',
                xtype:'dashboardmain6',
                autoCreate:true
            },
            dashboardSub:{
                selector:'#dashboardsub6',
                xtype:'dashboardsub6',
                autoCreate:true
            }
        },
        control:{
            dashboardMain:{
                initialize:'applyDashboardMain'
            },
            dashboardSub:{
                initialize:'applyDashboardSub'
            }
        }
    },
    /* Version : 1 */
    applyDashboardMain:function(){
        var panel = this.getDashboardMain();

        Ext.define('dashboardMainModel6',{
            extend:'Ext.data.Model',
            config:{
                fields:['category','title','field1','field2','field3','field4']
            }
        });
        var store = Ext.create('Ext.data.Store', {
            model: 'dashboardMainModel6',
            sorters: 'category',
            grouper: {
                groupFn: function(record) {
                    return record.get('category');
                }
            },
            data: [
                { category:'수익지표',title:'매출액',field1:'3,408', field2:'4,731',field3:'달성률',field4:'120%'},
                { category:'수익지표',title:'EBITDA',field1:'1,041', field2:'1,081',field3:'달성률',field4:'104%'},
                { category:'수익지표',title:'당기순이익',field1:'416', field2:'460',field3:'달성률',field4:'111%'},
                { category:'비용지표',title:'영업원가',field1:'70.55', field2:'85.91',field3:'차이',field4:'15.36'},
                { category:'비용지표',title:'재료비원가',field1:'54.53', field2:'72.75',field3:'차이',field4:'18.23'},
                { category:'비용지표',title:'kW당 수선유지비',field1:'721', field2:'724',field3:'차이',field4:'2.90'},
                { category:'생산성지표',title:'1인당판매량',field1:'1,935', field2:'2,322',field3:'달성률',field4:'120%'},
                { category:'생산성지표',title:'1인당매출액',field1:'167', field2:'233',field3:'달성률',field4:'139%'},
                { category:'생산성지표',title:'1인당EBITDA',field1:'50.97', field2:'53.13',field3:'달성률',field4:'104%'}
            ]
        });
        var lvList = Ext.create('Ext.List', {
            fullscreen: true,
            itemTpl: '<table width="100%"><tr><td width="25%"><img width="30px" height="30px" src="resources/icons/arrow_forward.png">{title}</td>' +
                     '<td width="25%">{field1}</td>' +
                     '<td width="25%">{field2}</td>' +
                     '<td>{field3}:<img width="30px" height="30px" src="resources/icons/arrow_up.png">{field4}</td></tr></table>',
            store: store,
            grouped: true,
            listeners:[{
                event:'itemtap',
                fn:function(me, index, target, record, e, eOpts){
                    var panel = Ext.getCmp('dashboardview6');
                    panel.animateActiveItem(1,{
                        type:'cover',
                        direction:'left',
                        duration:500
                    });
                }
            }]
        });
        panel.add(lvList);
    },
    applyDashboardSub:function(){
        var panel = this.getDashboardSub();
        var arrChartType = ['area','bar'];
        var arrPanels = [];

        Ext.define('dashboardSubModel6',{
            extend:'Ext.data.Model',
            config:{
                fields:['category','title','field1','field2','field3','field4']
            }
        });
        var store = Ext.create('Ext.data.Store', {
            model: 'dashboardSubModel6',
            sorters: 'category',
            grouper: {
                groupFn: function(record) {
                    return record.get('category');
                }
            },
            data: [
                { category:'수익지표',title:'매출액',field1:'3,408', field2:'4,731',field3:'달성률',field4:'120%'}
            ]
        });
        var lvList = Ext.create('Ext.List', {
            fullscreen: true,
            itemTpl: '<table width="100%"><tr><td width="25%"><img width="30px" height="30px" src="resources/icons/arrow_down.png">{title}</td>' +
                '<td width="25%">{field1}</td>' +
                '<td width="25%">{field2}</td>' +
                '<td>{field3}:<img width="30px" height="30px" src="resources/icons/arrow_up.png">{field4}</td></tr></table>',
            store: store,
            grouped: true,
            listeners:[{
                event:'itemtap',
                fn:function(me, index, target, record, e, eOpts){
                    var panel = Ext.getCmp('dashboardview6');
                    panel.animateActiveItem(0,{
                        type:'reveal',
                        direction:'right',
                        duration:500
                    });
                }
            }]
        });
        var subPanel = Ext.create('Ext.Panel',{
            height:'84px',
            layout:'fit',
            items:lvList
        });
        arrPanels.push(subPanel);

        for(var i=0;i<2;i++){
            var getChart = Ext.create('Ext.chart.Chart',{
                animate: true,
                store: {
                    fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
                    data: [
                        {'name':'metric one', 'data1':Math.ceil(100*Math.random()), 'data2':Math.ceil(100*Math.random()), 'data3':Math.ceil(100*Math.random()), 'data4':Math.ceil(100*Math.random()), 'data5':Math.ceil(100*Math.random())},
                        {'name':'metric two', 'data1':Math.ceil(100*Math.random()), 'data2':Math.ceil(100*Math.random()), 'data3':Math.ceil(100*Math.random()), 'data4':Math.ceil(100*Math.random()), 'data5':Math.ceil(100*Math.random())},
                        {'name':'metric three', 'data1':Math.ceil(100*Math.random()), 'data2':Math.ceil(100*Math.random()), 'data3':Math.ceil(100*Math.random()), 'data4':Math.ceil(100*Math.random()), 'data5':Math.ceil(100*Math.random())},
                        {'name':'metric four', 'data1':Math.ceil(100*Math.random()), 'data2':Math.ceil(100*Math.random()), 'data3':Math.ceil(100*Math.random()), 'data4':Math.ceil(100*Math.random()), 'data5':Math.ceil(100*Math.random())},
                        {'name':'metric five', 'data1':Math.ceil(100*Math.random()), 'data2':Math.ceil(100*Math.random()), 'data3':Math.ceil(100*Math.random()), 'data4':Math.ceil(100*Math.random()), 'data5':Math.ceil(100*Math.random())}
                    ]
                },
                legend: {
                    position: 'top'
                },
                axes: [{
                    type: 'numeric',
                    position: 'left',
                    fields: ['data1'],
                    title: {
                        text: 'Sample Values',
                        fontSize: 15
                    },
                    grid: true,
                    minimum: 0
                }, {
                    type: 'category',
                    position: 'bottom',
                    fields: ['name'],
                    title: {
                        text: 'Sample Values',
                        fontSize: 15
                    }
                }],
                series: [{
                    type: arrChartType[i],
                    title: ['Data1', 'Data2', 'Data3'],
                    subStyle: {
                        fill: ['blue', 'green', 'red']
                    },
                    xField: 'name',
                    yField: ['data1', 'data2', 'data3']
                }]
            });
            var subPanel = Ext.create('Ext.Panel',{
                flex:1,
                layout:'fit',
                items:getChart
            });
            arrPanels.push(subPanel);
        }
        panel.add(arrPanels);
    }
});